<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <!--<script type="text/javascript" src="flowplayer-3.0.5.min.js"></script>-->
    <script src="../flowplayer-3.2.6.min.js"></script>


	<!-- page title -->
	<title>Minimal Flowplayer setup</title>

</head><body>

	<div id="page">
        <a
                     href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv"
                     style="display:block;width:500px;height:320px"
                     id="player">
                </a>
<script>
    flowplayer("player", "../build/flowplayer.swf",
    {
        log: { level: 'debug', filter: 'org.flowplayer.view.AnimationEngine' },
//        log: { level: 'debug', filter: 'org.flowplayer.menu.Menu,org.flowplayer.bitrateselect.BitrateSelectProvider' },

onFinish: function() {
    console.log("onFinish");
//            $f().getPlugin("menu").fadeIn();
},

onPause: function() {
    console.log("onPause");
},

onResume: function() {
    console.log("onResume");
},

//        play: {
//            height: 60
//        },

clip: {
    autoPlay: false,
    baseUrl: 'http://blip.tv/file/get',

    onStart: function() {
        console.log("onStart");
        var menuProps = $f().getPlugin("menu").css();
        if (menuProps.opacity == 1) {
            $f().getPlugin("menu").fadeOut();
        }
        $f().getPlugin("dock").fadeOut();
        $f().getPlugin("play").css({ height: '22%' });
        $f().reset();
    },

    onBeforeFinish: function() {
        return false;
    },

    onFinish: function() {
        console.log("onFinish");
        $f().getPlugin("menu").fadeIn();
        $f().getPlugin("dock").fadeIn();
        $f().getPlugin("play").css({ height: 60 });
        $f().getScreen().animate({ left: 10, top: 10, width: 250, height: 150 })
    }
},
playlist: [
    'KimAronson-TwentySeconds59483.flv',
    'KimAronson-TwentySeconds58192.flv',
    'KimAronson-TwentySeconds63617.flv',
    'KimAronson-TwentySeconds64268.flv',
    'KimAronson-TwentySeconds67463.flv',
    'KimAronson-TwentySeconds65459.flv'
],
plugins: {
    menu: {
        url: 'flowplayer.menu.swf',
        items: [
            { label: '<b>first clip</b><br/><i>3:30</i>', imageUrl: 'http://static.flowplayer.org/img/demos/thumb1.jpg', index: 0 },
            { label: 'second clip', imageUrl: 'http://static.flowplayer.org/img/demos/thumb2.jpg', index: 1 },
            { label: '<b>third clip</b><br/><i>3:66</i>', imageUrl: 'http://static.flowplayer.org/img/demos/thumb3.jpg', index: 2 },
            { label: 'fourth clip', imageUrl: 'http://static.flowplayer.org/img/demos/thumb4.jpg', index: 3 },
            { label: '<b>fifth clip</b><br/><i>13:30</i>', imageUrl: 'http://static.flowplayer.org/img/demos/thumb5.jpg', index: 4 },
            { label: 'sixth clip', imageUrl: 'http://static.flowplayer.org/img/demos/thumb1.jpg', index: 5 }
        ],

        // default style for items
        menuItem: {
//                    color: "rgba(10,10,10,1)",
//                    overColor: "rgba(200,0,0,1)"

//                    fontColor: "rgba(255,0,100, 0.1)"
            height: 70
        },

        scrollButtons: {
            backgroundGradient: 'none',
            color: "rgba(255,10,10,1)"
        },

        right: 10,
        scrollable: true,
        height: 284,
        width: 220,

        onSelect: function(item) {
            console.log("onSelect()", item);

            if (item.index >= 0) {
                console.log("onSelect() playing item " + item.index);
                $f().play(item.index);
            }
        }
    },
    share: {
        url: 'flowplayer.sharing.swf',
        buttons: {
            overColor: 'rgba(255,10,10,0.5)'
        }
    },
    dock: {
        display: 'none',
        left: 10,
        top: 170,
        height: 59,
        autoHide: false,
        overColor: '#'
    },
    controls: {
        autoHide: false
    }
}

    });
</script>
	</div>
	
	
</body></html>